.tree {
    font-size:16px;
   margin:0 0 0 0.47em;
}
.tree li {
    list-style-type:none;
    margin:0;
    padding:0.625em 0 0 0.31em;
    position:relative;
    text-align: left;
}
.tree li::before, .tree li::after {
    content:'';
    left:-1.25em;
    position:absolute;
    right:auto;
}
.tree li::before {
    border-left:1px solid #999;
    bottom:3.125em;
    height:100%;
    top:0;
    width:1px;
    margin-top:-0.3125em;
    z-index: 0;
}
.tree li::after {
    border-top:1px solid #999;
    height:1.25em;
    top:1.56em;
    width:1.56em;
}
.tree li span {
    -moz-border-radius:5em;
    -webkit-border-radius:5em;
    border:1px solid #999;
    border-radius:5em;
    display:inline-block;
    padding:0.3em 0.6em;
    text-decoration:none;
    min-width: 3.5em;
    text-align: center;
    background: #fff;
    min-height: 1.2em;
    position: relative;
    z-index: 1;
}
.tree li.parent_li>span {
    cursor:pointer
}
.tree>ul>li::before, .tree>ul>li::after {
    border:0
}
.tree li:last-child::before {
    height:1.875em;
}
.tree li.parent_li>span:hover, .tree li.parent_li>span:hover+ul li span {
    background:#eee;
    border:1px solid #94a0b4;
    color:#000
}
.outer_ul{
    width:60%;
    margin:0 auto;
}
.outer_ul ul{
    padding: 0;
    margin: 0 0 0 2em;
}
#my_superior{
    margin: auto;
    width: 60%;
    margin-bottom:1.6em;
}
#my_superior li::after{
    content:"";
    height:10px;
    border-left:1px dashed red;
    position: relative !important;
    padding-top:1.875em;
    top:2.5em;
    left: -2.5em;
    z-index: -1;
}
.icon {
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color:#94A0A5;
}
.icon-minus-sign:before {
    content: "\f068";
}
.icon-plus-sign:before {
    content: "\f067";
}